/**
 * 按钮点击次数统计，useState()实现方案
 * 导入React，同时导入useState
 * 1 状态
 * 2 修改状态
 * 3 显示点击次数
 */
import React, { useState, useEffect } from "react";

const HookCounter = () => {
  // 状态和修改状态的方法
  const [count, setCount] = useState(0);

  const handleCount = () => {
    setCount(count + 1);
  };

  // useEffect
  useEffect(() => {
    document.title = `按钮被点击了${count}次`;
    // 返回一个清理函数
    return () => {
      console.log("此次按钮点击我们做了清理操作");
    };
  });

  return <button onClick={handleCount}>按钮被点击了{count}次</button>;
};

export default HookCounter;
